<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>商铺</title>
    <link rel="stylesheet" type="text/css" href="../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../css/style.css" />
    <link rel="stylesheet" type="text/css" href="../css/swiper.min.css" />
    <link rel="stylesheet" type="text/css" href="../css/layer.css" />
    <link rel="stylesheet" type="text/css" href="../css/mdw.css" />
    <script type="text/javascript" src="../script/api.js"></script>
    <script type="text/javascript" src="../script/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="../script/swiper.min.js"></script>
    <script type="text/javascript" src="../script/mobile.js"></script>
    <script type="text/javascript" src="../script/layer.js"></script>
    <script type="text/javascript" src="../script/mdw.js"></script>
    <script type="text/javascript" src="../script/jumpPage.js"></script>

</head>
<body>
    <header class="header shopHeader">
       <div class="shopHeaderBox1">
            <div class="backPrevPages" onclick="historyBack()"></div>
            <div class="seachBox">
                <i></i>
                <input id="key" class="" placeholder="请输入关键字" />
            </div>
            <div class="headerRights" onclick="shoppingCart()"></div>
       </div>
       <div class="shopHeaderBox2">
           <div class="shopImg">
                <img src=""/>
                <span id="shop_Name"></span>
            </div>
           <div onclick="shoucang();" class="shop_favorite"><i></i>收藏</div>
       </div>
       <div class="shopHeaderBackImg">
           <img src="" />
       </div>
    </header>
    <section class="shopPage HTML_BOX">
        <div class="banner bg-fff">
                <div class="banner_swiper swiper-container">
                    <div class="swiper-wrapper bannerList">
                        
                    </div>
                    <div class="swiper-pagination"></div>
                </div>
        </div>
        <ul class="wareSelectBox">
            <li class="selectli on count" data-sort="1" data-type="1"><span>销量</span><i></i></li>
            <li class="selectli price" data-sort="2" data-type="2"><span>价格</span><i></i></li>
            <li class="selectli time" data-sort="3" data-type="2"><span>上传时间</span><i></i></li>
            <li class="select"><span>筛选</span><i></i></li>
        </ul>
        <ul class="wareList_1">
            
        </ul>
        <div class="pageHide dn">暂无数据..</div>
    </section>
    <section onclick="go_details()" class="shopFooter f_c">查看商铺信息</section>
    <div class="mask_pop ">
        <div class="mask"></div>
        <div class="select_pop">
            <div id="seachItemBox">
                <p class="pop_title">筛选</p>
                <div class="select_pop_box">
                    <div class="boxTitle">价格区间</div>
                    <div class="pop_price">
                       <input placeholder="最低价" />
                       <span></span>
                        <input placeholder="最高价" />
                    </div>
                </div>
                <div class="select_pop_box">
                    <div class="boxTitle">产地</div>
                    <ul id="zone" class="pop_classify">
                        
                    </ul>
                </div>
            </div>
            <div style="border-top:1.44rem solid #fff;"></div>
            <div class="select_pop_btns">
                <div class="btn remake">重置</div>
                <div class="btn submit">确定</div>
            </div>
        </div>
    </div>
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript">
    var page = 1;//页数
    var ret3 = 0;//预备type3
    var rez ="";
    var pageParam;
    var sort=1;
    var sort_type=1;
    var keys = "";
    var jgmin ="";
    var jgmax ="";
    var zone ="";
    var ifware = true;
    var shop_info;
    var ifpage = true;
    var bannerSwiper;
    apiready = function(){
        $api.fixStatusBar($api.dom('header'));
        var sysType = api.systemType;
        if(sysType == 'ios'){
            $(".select_pop").css("padding-top","20px");
        }else if(sysType == 'android'){
            $(".select_pop").css("padding-top","24px");
        }
        api.setStatusBarStyle({
            color: '#fff',//设置APP状态栏背景色
            style: 'dark'
        });
        api.addEventListener({
            name: 'scrolltobottom',
            extra: {
                 threshold: 10
            }
         }, function(ret, err) {
             //页码+1，继续请求数据
             
             if(ifpage){
                page++;
                warelist();
             }
        });
        ifCnAndEn();
        pageParam = api.pageParam;
        console.log(JSON.stringify(pageParam));
        warelist();
    };
    var isload = true;
    function warelist(){
        var params = {
            page:page,//页数   
            sdid:pageParam.sdid,
            type1:pageParam.type1,
            type2:pageParam.type2,
            keys:keys,
            jgmin:jgmin,
            jgmax:jgmax,
            zone:zone,
            limit:24
        }
        if(sort==1){
            params.xl=1;
        }else if(sort==2){
            params.price=sort_type;
        }else if(sort==3){
            params.time=sort_type;
        }
        pop.loading();
        getAjax(Interface.allsp,params,function(res){
            pop.close();
            console.log(JSON.stringify(res));
            if(isload){
                isload=false;
                var zone_list = res.data.zone_list;
                shop_info = res.data.shop_info;
                $(".shopImg img").attr("src",getImg(shop_info.icon));
                if(shop_info.app_icon){
                    $(".shopHeaderBackImg img").attr("src",getImg(shop_info.app_icon)).load(function(){
                        $(".shopPage").css("top",$(".header").height()+"px");
                        pop.close();
                    });
                }else{
                    $(".shopHeaderBackImg img").attr("src","../image/shop_backImg.png").load(function(){
                        $(".shopPage").css("top",$(".header").height()+"px");
                        pop.close();
                    });
                }
                if(res.data.shop_banner){
                   $.each(res.data.shop_banner,function(i,item){
                        var url = '';
                        if(cnen==1){
                            url = item.mobile_icon;
                        }else{
                            url = item.mobile_icon2;
                        }
                        $(".bannerList").append('<div onclick="openApp(\''+url+'\','+item.app_id+','+item.app_type+')" class="swiper-slide"><img src="'+getImg(item.mobile_icon)+'" /></div>');
                    })
                    bannerSwiper = new Swiper('.banner_swiper', {
                        autoplay: 3000,//可选选项，自动滑动
                        loop : true,
                        //speed:1000,
                        observer:true,//修改swiper自己或子元素时，自动初始化swiper 
                        observeParents:false,//修改swiper的父元素时，自动初始化swiper 
                        pagination : '.swiper-pagination',
                        autoplayDisableOnInteraction: false,
                        touchMoveStopPropagation: false,
                    })
                }else{
                    $(".banner").hide();
                }
                if(cnen==2){
                    shop_info.username = shop_info.egusername;
                }
                $("#shop_Name").html(shop_info.username);
                var all = '全部';
                if(cnen ==2){
                    all = 'All';
                }
                $("#zone").append('<li class="on" onclick="pop_zone(this,\'0\')"" >'+all+'</li>');
                if(zone_list !=null){
                    $.each(zone_list,function(i,item){
                        var name = item.title;
                        if(cnen ==2){
                            name = item.egname;
                        }
                        var html ='<li onclick="pop_zone(this,\''+item.id+'\')">'+name+'</li>';
                        $("#zone").append(html);
                    })
                }
            }

            var list = res.data.list;
            if(page==1){
                $(".wareList_1").empty();
            }
            if(list!="" && list !=null && list !=false){
                $(".pageHide").addClass("dn");ifpage=true;
                $.each(list,function(i,item){
                    var name = '';
                    if(cnen==1){
                        name = item.title;
                    }else{
                        name = item.egname;
                    }
                    var html = '<li onclick="goWare(\''+item.id+'\')">'+
                        '<div class="wareImgBox"><img src="'+getImg(item.icon)+'" /></div>'+
                        '<div class="wareName"><span>'+name+'</span></div><div class="warePrice">';
                        if(item.old_price == ""){
                                html+='<span>$'+item.new_price+'</span>';
                            }else{
                                html+='<span>$'+item.new_price+'</span>';
                                html+='<del>'+item.old_price+'</del>';
                            }
                    html+='</div></li>';
                    $(".wareList_1").append(html);
                })
            }else{
                ifpage=false;
                if(page==1){$(".pageHide").removeClass("dn");} 
            }
        },function(res,err){});
    }
    $(".select").click(function(){
        maskOpen();  
        $(".select_pop").animate({right:'0rem'},350);//展开动画
    })
    $(".mask").click(function(){
        //收回动画
        $(".select_pop").animate({right:'-6.05rem'},350,function(){
            maskClose();
        });
    })
    $(".remake").click(function(){
        //收回动画
        $(".select_pop").animate({right:'-6.05rem'},350,function(){
            maskClose();
        });
    })
    $(".submit").click(function(){
        //收回动画
        pageParam.type3 = ret3;
        page = 1;
        zone = rez;
        jgmin= $(".pop_price input").eq(0).val();
        jgmax= $(".pop_price input").eq(1).val();
        warelist();
        $(".select_pop").animate({right:'-6.05rem'},350,function(){
            maskClose();
        });
    })

    //选择fenlei
    function pop_classify (e,id){
        $(e).parent().find("li").removeClass("on");
        $(e).addClass("on");
        ret3 = id;
    }
    //选择fenlei
    function pop_zone (e,id){
        $(e).parent().find("li").removeClass("on");
        $(e).addClass("on");
        rez = id;
    }
    //筛算按钮
    $(".wareSelectBox .selectli").click(function(){
        //type 1为销量 只有从上到下
        //2为上下两边 故清楚dwon和 top
        //top从下到上 down 从上到下
        var type = $(this).data("type");
        sort = $(this).data("sort");
        console.log(type);
        if(type==2){
            //如果不为销量，默认从上到下
            var ison = $(this).hasClass("on");
            console.log(ison);
            if(ison){
                var istop = $(this).hasClass("top");
                if(istop){
                    sort_type=1;
                    $(this).removeClass("top");
                    $(this).addClass("down");
                }else{
                    sort_type=2;
                    $(this).addClass("top");
                     $(this).removeClass("down");
                }
            }else{
                $(".wareSelectBox .selectli").removeClass("on");
                $(".wareSelectBox .selectli").removeClass("down");
                $(".wareSelectBox .selectli").removeClass("top");
                $(this).addClass("down");
            }
            $(this).addClass("on");
        }else{
            $(".wareSelectBox .selectli").removeClass("on");
            $(".wareSelectBox .selectli").removeClass("down");
            $(".wareSelectBox .selectli").removeClass("top");
            $(this).addClass("on");
        }
        page=1;
        warelist();
    });
    $(".headerRights").click(function(){
        
    })
    $(".getPage").click(function(){
        page++;
        warelist();
    })
     $('#key').bind('keydown',function(event){
        if(event.keyCode == "13")    
        {
            page=1;
            keys = $("#key").val();
            warelist();
        }
 
    });
    //  $(document).keydown(function(e) {
    //     if (e.keyCode == 13) {
    //         //dologin();
    //     }
    // });


     function go_details(){
        var p = shop_info;
        openWin('shop_details','shop_details.html',p);
     }
    
    var is_collect = false;
    var collect_id = 0;
    function shoucang(){
        if(!isLogin()){
            return;
        }

        if(is_collect){
            getAjax(Interface.del_collect,{token:token,id:collect_id},function(res){
                pop.close();
                pop.notice(res.msg);
                is_collect = false;
                $(".shop_favorite").removeClass("on");
            },function(res,err){})
        }else{
            var p = {token:token,type:2,scshop_id:pageParam.sdid};
            console.log(JSON.stringify(p));
            getAjax(Interface.join_collect,p,function(res){
              console.log(JSON.stringify(res));
              pop.close();
              pop.notice(res.msg);
              is_collect = true;
              collect_id = res.data;
              $(".shop_favorite").addClass("on");
            },function(res,err){})
        }
    }
</script>
<script type="text/javascript">
    function ifCnAndEn(){
        if(cnen==2){
           $(".seachBox input").attr('placeholder',"Please input Key");
           $(".wareSelectBox li").eq(0).find("span").html('Sales');
           $(".wareSelectBox li").eq(1).find("span").html('Price');
           $(".wareSelectBox li").eq(2).find("span").html('Arrivals');
           $(".wareSelectBox li").eq(3).find("span").html('Filter');
           $(".boxTitle").eq(0).html('Categories');
           $(".boxTitle").eq(1).html('Price range');
           $(".boxTitle").eq(2).html('Origin');
           $(".pop_title").html('Filter');
           $(".getPage").html('Click to load more...');
           $(".pop_price input").eq(0).attr('placeholder',"Min Price");
           $(".pop_price input").eq(1).attr('placeholder',"Max Price");
           $(".remake").html('Reset');
           $(".submit").html('Filter');
           $(".shopFooter").html('View store information');
        }
    }
</script>
</html>